<template>
  <div id="#app">
    <el-header v-show="route.meta.requiresAuth">
      <!-- 调用公共头部 -->
      <HeaderCom />
    </el-header>

    <RouterView class="page"/>

    <el-footer v-show="route.meta.requiresAuth">
      <!-- 调用公共底部组件 -->
      <FooterCom />
    </el-footer>
  </div>
</template>

<script setup lang="ts">
import HeaderCom from '@/components/HeaderCom.vue'
import FooterCom from './components/FooterCom.vue';
import { useRoute } from 'vue-router';

const route = useRoute()
</script>

<style scoped lang="less">
.el-header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 70px;
  padding-bottom: 10px;
  border-bottom: 1px solid #ffffff;
  z-index: 99;
  background-color: #ffffff;
}
.page{
  padding-top: 70px;
  min-height: calc(100vh - 120px);
}

</style>
